import React,{useState} from 'react'
import { useNavigate } from 'react-router-dom'
import { ShareSheet, Cell } from 'react-vant'


import './guanyu.css'
export default function Guanyu() {
    const options = [
        [
          { name: '微信', icon: 'wechat' },
          { name: '朋友圈', icon: 'wechat-moments' },
          { name: '微博', icon: 'weibo' },
          { name: 'QQ', icon: 'qq' },
        ],
        [
          { name: '复制链接', icon: 'link' },
          { name: '分享海报', icon: 'poster' },
          { name: '二维码', icon: 'qrcode' },
          { name: '小程序码', icon: 'weapp-qrcode' },
        ],
      ]
    const [visible, setVisible] = useState(false)
    const navigate = useNavigate()
  return (
    <div className='gy'>
      <div className='gy-head'>
      <span className='gy-fan' onClick={()=>{navigate('/app/my')}}>&lt;</span>
      <p className='gy-zi'>关于我们</p>
     </div>
     <div className='gy-main'>
        <img src={require('./img/logo.png')}></img>
        <p>小默校园跑</p>
        <p>v1.0.6</p>
       
     </div>
     <div className='gy-fx'  onClick={() => setVisible(true)} >
        <p>分享给好友</p>
        <div>&gt;</div>
     </div>
     <div className='gy-gx'>
        <p>版本更新</p>
        <div>&gt;</div>
     </div>
     <div>
     <ShareSheet
        visible={visible}
        options={options}
        title='立即分享给好友'
        onCancel={() => setVisible(false)}
        onSelect={(option, index) => {
          console.log('option', option)
          console.log('index', index)
          setVisible(false)
        }}
      />
     </div>
    </div>
  )
}
